<template>
<div class="endDorsement">
  <div class="endDorsement_conter">
  <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px" style="display: flex;justify-content: space-between;align-items: flex-end">
    <div style="display: flex;flex-flow: wrap">
    <el-form-item label="员工姓名" prop="name">
      <el-input v-model="queryParams.name" placeholder="请输入员工姓名" clearable size="small"
                @keyup.enter.native="handleQuery"/>
    </el-form-item>
    <el-form-item label="证件号码" prop="id_card_no">
      <el-input v-model="queryParams.id_card_no" placeholder="请输入证件号码" clearable size="small"
                @keyup.enter.native="handleQuery"/>
    </el-form-item>
    <el-form-item label="实际用工单位" prop="company" label-width="150">
      <el-input v-model="queryParams.company" placeholder="请输入实际用工单位" clearable size="small"
                @keyup.enter.native="handleQuery"/>
    </el-form-item>
    <el-form-item label="操作类型" prop="option">
      <el-select v-model="queryParams.option" placeholder="请选择" style="width: 200px" >
        <el-option
            v-for="dict in insured"
            :key="dict.id"
            :value="dict.id"
            :label="dict.name"
        >{{ dict.name }}
        </el-option>

      </el-select>
    </el-form-item>
    </div>
    <el-form-item style="width: 150px;text-align: right">
      <el-button type="primary" size="mini" @click="handleQuery">搜索</el-button>
      <el-button type="info"  size="mini" @click="resetQuery">重置</el-button>
    </el-form-item>
  </el-form>
  <el-row :gutter="10" class="mb8">
    <el-button
        style="margin-right: 10px"
        type="info"
        size="mini"
        :disabled="multiple"
        @click="handleDelete"
        v-hasPermi="['insurance:user:remove']"
    >删除
    </el-button>
    <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
  </el-row>

  <el-table v-loading="loading" :data="insureEliList" @selection-change="handleSelectionChange"  :header-cell-style="tableHeaderColor">
    <el-table-column type="selection" width="55" align="center"/>
    <el-table-column label="保单号" align="center" prop="insure_no"/>
    <el-table-column label="员工姓名" align="center" prop="name"/>
    <el-table-column label="证件类型" align="center" prop="id_card_type_name"/>
    <el-table-column label="证件号码" align="center" prop="id_card_no" />
    <el-table-column label="工种/岗位" align="center" prop="industry_name" />
    <el-table-column label="操作类型" align="center" prop="ile_status" />
    <el-table-column label="实际用工单位" align="center" prop="company" />
    <el-table-column label="工种类别" align="center" prop="type" />
    <el-table-column label="创建时间" align="center" prop="create_time" />
    <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="250px">
      <template slot-scope="scope">
        <el-button
            style="color:#FF0000 "
            size="mini"
            type="text"
            @click="handleDelete1(scope.row)"
        >删除
        </el-button>

      </template>
    </el-table-column>
  </el-table>
  </div>
  <pagination
      style="background: transparent"
      v-show=" total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
  />

</div>
</template>

<script>
import {get_insure,get_approve_user} from "@/api/insurance/approveLog";
import {delete_user} from "@/api/insurance/user";
export default {
  name: "index",
  data(){
    return{
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 查询参数
      queryParams: {
        pageNum: 1,//页码
        pageSize: 10,//每页数量
        id_card_no:'',//保单号
        company:'',//用工单位
        name:'',//投保人
        insure_id:'',//保单id
        option:'',//操作类型 0删除 1增加
      },
      insured:[
        {
          id:'0',
          name:'删除'
        },
        {
          id:'1',
          name:'新增'
        }
      ],

      total:0,
      //  保单id:
      insureId:'',
      insureEliList:[],
      delList:{
        eli_id:'',// 保单id
        uid:'',//当前操作用户id
        type:2,//选择方式  1全选  2单选
        user_id:'',//二级权限用户id，可传空
        customer_id:'',//被删除用户id,数组形式，可传空
      }
    }
  },
  methods:{
    /* 修改表头颜色 */
    tableHeaderColor({ rowIndex }) {
      if (rowIndex === 0) {
        return 'background-color: #304156;color: #fff;font-weight: 400;font-family: Microsoft YaHei;'
      }
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.id)
      this.single = selection.length !== 1
      this.multiple = !selection.length;
      if (this.insureEliList.length==selection.length){
        this.delList.customer_id=''
        this.delList.type=1
      }else{

        this.delList.customer_id=this.ids
        this.delList.type=2;
      }
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 查询雇主责任险保单列表 */
    getList() {
      this.loading = true;
      get_approve_user(this.queryParams).then(response=>{
        // console.log('response批单',response)
        // console.log('查询',response)
        this.insureEliList = response.data.list;
        // console.log('insureEliList', this.insureEliList)
        this.total = response.data.count;
        this.loading = false;
      })

      // get_insure(this.queryParams).then(response=>{
      //
      // })
    },
    //删除操作
    handleDelete(){
      var that = this;
      const ids =  this.ids;

        this.$confirm('是否确认删除投保用户编号为"' + ids + '"的数据项?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function () {
          delete_user(that.delList).then(res=>{
            // console.log('删除成功',res)
            if(res.code==1){
              that.msgSuccess(res.msg);
              that.getList();
            }

          })
          // delUser1(ids).then(res=>{
          //   console.log('res',res)
          //
          //
          //   that.msgSuccess("删除成功");
          // });
        })
    },
    handleDelete1(row) {
      // console.log('row',row)
      const ids = row.id;
      this.delList.customer_id = ids;
      var that = this;
      // console.log('delList23',  ids)
      this.$confirm('是否确认删除投保用户编号为"' + ids + '"的数据项?', "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(function () {
        // console.log('ids13', ids);
        delete_user(that.delList).then(res => {
          // console.log('res', res)
          that.getList();
          that.msgSuccess(res.msg);
        });
      })
    }
  },
  created() {
    this.delList.uid = JSON.parse(localStorage.getItem('userInfo')).userId;
    var insure=this.$route.query.Endorsement;
    // console.log('a',insure)
    if (insure!=undefined){
       this.queryParams.insure_id=insure.id;
       this.delList.eli_id=insure.id;
      // console.log('235346')
    }
    this.getList();

  }
}
</script>

<style scoped lang="scss">
.endDorsement{
 margin: 20px;
  .endDorsement_conter{
    background: #F8FBFF;
    padding:30px;
    border-radius: 10px;
    box-sizing: border-box;
  }
}
</style>
